<%-- 
  - Author: Srikanth Yadav
  - Date: 17-Mar-2013
  - Copyright Notice: TRAKHEES
  - Description: form.jsp
 --%>

<%@page import="org.springframework.web.context.request.RequestScope"%>
<%@page import="ae.pcfc.etks.online.web.util.SecurityUtils"%>
<%@ include file="/WEB-INF/view/include.jsp"%>
<%@ page import="ae.pcfc.etks.online.web.*"%>
<c:choose>
	<c:when
		test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
		<script language="Javascript"
			src='<c:url value="/resources/js/ui/jquery.ui.datepicker-ar.js"/>'></script>
	</c:when>
	<c:otherwise>
		<script language="Javascript"
			src='<c:url value="/resources/js/ui/jquery.ui.datepicker.js"/>'></script>
	</c:otherwise>
</c:choose>

<script type="text/javascript"><!--
	$().ready(function() {	
		$.validator.addMethod(
				"maxDateRange100", 
				function() {
					
					var startDate = $("#startDate").datepicker("getDate");
    				var endDate = $("#endDate").datepicker("getDate");

    				return ((endDate - startDate)/(1000*60*60*24))<=100;
	    });	  


		$.validator.addMethod(
				"startDateEndDate", 
				function() {
					
							var startDate = $("#startDate").datepicker("getDate");
	        				var endDate = $("#endDate").datepicker("getDate");

	        				return (endDate >= startDate);
	    });		
	
		$("#PaymentAdviceStatusReport").validate({

			onfocusout:false,
			onkeyup:false,
			onclick: false,			
			rules : {
				//Step # 1 Rules
				
				startDate : {// compound rule
					required : true,
					date : true					
				},
				endDate : {// compound rule
					required : true,
					date : true,
					maxDateRange100 : true,
					startDateEndDate : true
														
				}	
				
			},
			
			showErrors : function(errorMap, errorList) {
				
				var errors = '<ul>';
				var label;				
				if (errorList.length) {
					$.each(errorMap, function(name, value) {
						label = $("label[for='" + name + "']").html();
						label = value + '[' + label + ']';
						errors = errors + '<li>' + label + '</li>';
						

					});
					errors = errors + '</ul>';
					jAlert('error', errors, '<spring:message code="label.errormessage" />');
					return false;
				}
			}		
		});
		

		$("#startDate,#endDate").datepicker({
			changeYear : true,
			changeMonth : true,
			dateFormat : 'dd/mm/yy',
			yearRange : '-50:+10',
			showButtonPanel : true,
			closeText : 'X'
		});		
		
	});


</script>


<div id="container" dir='<spring:message code="page.dir"/>'
	align='<spring:message code="page.align"/>'>



	<form:form name="PaymentAdviceStatusReport"
		id="PaymentAdviceStatusReport" method="POST"
		modelAttribute="<%=ConstantsAdmin.CLIENT_PAYMENT_ADVICE_MODEL_KEY %>">

		<spring:hasBindErrors
			name="<%=ConstantsAdmin.CLIENT_PAYMENT_ADVICE_MODEL_KEY %>">
			
			<script type="text/javascript">
				$(document)
						.ready(
								function() {
									jAlert(
											'error',
											'<li><form:errors path="*" delimiter="<li>"/>',
											'<spring:message code="label.errormessage" />');
								});
			</script>
			
		</spring:hasBindErrors>

	<div class="ui-widget_c ui-corner-all">
		<div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix"><spring:message code="client.payment.advice.report" /></div>
       	<div class="ui-widget_content_c ">
			
			<div>
				<div class="t_form_half float" style="margin-top: 20px">
					<div class="fm-req">
						<spring:message code="label.report.period.note" />
					</div>
					<div class="fm-req">
						<label for="startDate" >
		 	 				<span class="t_star">*</span><spring:message code="label.paymentadvice" />&nbsp;<spring:message code="paymentadvice.start.date" />		 	 						
	 	 				</label>
	 	 				<span id="dateInput"><form:input path="startDate" id="startDate" /></span>
					</div>			
					<div class="fm-req">
						<label for="endDate" >
		 	 				<span class="t_star">*</span><spring:message code="label.paymentadvice" />&nbsp;<spring:message code="paymentadvice.end.date" />							 	 				
		 	 			</label>
		 	 			<span id="dateInput"><form:input path="endDate" id="endDate"/></span>
					</div>
					<div class="fm-req">
						<label for="status" >
		 	 				<span class="t_star">*</span><spring:message code="paymentadvice.status" />							 	 				
		 	 			</label>
		 	 			<c:choose>
					<c:when
						test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
						<form:select path="status"
							items="${status}"
							id="status" itemLabel="labelAr" itemValue="id"
							cssStyle="width:130px;" class="fm-opt float"/>
					</c:when>
					<c:otherwise>
						<form:select path="status"
							items="${status}"
							id="status" itemLabel="labelEn" itemValue="id"
							cssStyle="width:130px;" class="fm-opt float"/>
					</c:otherwise>
				</c:choose>	 	 				 				 	 			
					</div>					
					<div class="fm-req">
						<label for="exportOption" >
		 	 				<span class="t_star">*</span><spring:message code="label.export.option" />							 	 				
		 	 			</label>
		 	 			<c:choose>
							<c:when
								test='${requestScope.requestContextAttribute.locale.language == "ar"}'>
								<form:select path="exportOption"
									items="${exportOption}"
									id="exportOption" itemLabel="labelAr" itemValue="id"
									cssStyle="width:130px;" class="fm-opt float" />
							</c:when>
							<c:otherwise>
								<form:select path="exportOption"
									items="${exportOption}"
									id="exportOption" itemLabel="labelEn" itemValue="id"
									cssStyle="width:130px;" class="fm-opt float" />
							</c:otherwise>
						</c:choose>
					</div>					
										
					<div class="fm-req">
						<input type="submit" name="save" value="<spring:message code="label.button.submit"/>" class="t_btns save"/>
						<input type="reset" name="reset" value="<spring:message code="label.button.reset" />" class="t_btns reset"/>
					</div>				
				</div>		
			</div>
		</div>
	</div>
	</form:form>


</div>
